<div id="create-page">
	<el-col :sm="4">
		<node-tree ref="pageTree"
			:data="pages"
			:header="title"
			:defaultExpand="[1]"
			:showButton="false"
			@handle-edit="edit">
		</node-tree>
	</el-col>
	<el-col :sm="20">
		<el-card class="page-node" header="页面节点信息">
			<el-row class="node-title">
				<el-col>
					<label>当前节点：</label>
				</el-col>
			</el-row>
			<el-form ref="pageForm" :model="mainPageParams" :rules="rules" label-position="right" label-suffix=":" label-width="100px" size="medium">
				<el-row>
					<form-element :colWidth="11" :formItems="mainItems" :model="mainPageParams" @handle-change="handleChange"></form-element>
				</el-row>
				<el-row>
					<el-col :push="16" :sm="6" style="margin-left: 6px;">
						<el-button class="button" type="primary" @click="handleSave()">保存</el-button>
					</el-col>
				</el-row>
				<div v-show="showParams" id="params-table">
					<el-row class="node-title">
						<el-col>
							<label>参数节点：</label>
						</el-col>
					</el-row>
					<el-row>
						<form-element :colWidth="11" :formItems="minorItems" :model="params"></form-element>
					</el-row>
					<el-row>
						<el-col :pull="1">
							<!-- Table -->
							<el-button v-show="showSearch" type="primary" @click="addParams()">添加查询参数属性</el-button>
							<el-button v-show="showSearch" type="primary" @click="addColums()">添加查询结果字段</el-button>
							<!-- Form -->
							<el-button v-show="showAdd" type="primary" @click="addForms()">添加新增表单属性</el-button>
						</el-col>
					</el-row>
				</div>
			</el-form>
		</el-card>
	</el-col>
	<table-dialog :columns="searchParamsColumns"
		:data="searchParamsData"
		:visible="dialogSearchParamsVisible"
		header="查询参数表" width="50%"
		@close="handleCloseParams"
		@submit="handleSubmitParams"
		@handle-append="appendRow"
		@handle-remove="removeRow">
	</table-dialog>

	<table-dialog :columns="searchColumnsColumns"
		:data="searchColumnsData"
		:visible="dialogSearchColumsVisible"
		header="查询结果字段表" width="70%"
		@close="handleCloseColumns"
		@submit="handleSubmitColumns"
		@handle-append="appendColumn"
		@handle-remove="removeColumn">
	</table-dialog>

	<table-dialog :columns="addFormColumns"
		:data="addFormData"
		:visible="dialogAddFormVisible"
		header="新增表单属性表" width="55%"
		@close="handleCloseForms"
		@submit="handleSubmitForms"
		@handle-append="appendForm"
		@handle-remove="removeForm">
	</table-dialog>
</div>
